<template>
	<view>
		<u-navbar title="填写合同" @rightClick="jump('/pages/contract/download')" :autoBack="true" rightText="删除合同">
		</u-navbar>
		<view class="top"></view>

		<view @click="jump('/pages/contract/assets')"
			class="back-color-c m-t-20 flex-between p-l-30 p-t-22 p-r-30 p-b-36">
			<view v-if="isObjNone(select_assets)" class="df fdc">
				<text class="font-32 color-d">{{select_assets.address}}</text>
				<text
					class="font-24 color-a m-t-24">{{select_assets.province_name}}{{select_assets.city_name}}{{select_assets.district_name}}</text>
			</view>
			<view v-else class="font-32">请选择资产</view>
			<u-icon name="arrow-right" color="#ccc" size="25rpx"></u-icon>
		</view>

		<view class="m-t-20">
			<view class="h-120 flex-between back-color-c p-l-30 p-r-30">
				<text class="font-28 color-d"><text class="color-e m-r-5">*</text>合同类型</text>
				<input v-model="form.type" class="text-right flex-1 m-l-20 font-28 color-a" placeholder="未填写"
					type="text" disabled="true">
			</view>
			<view class="h-120 flex-between back-color-c p-l-30 p-r-30">
				<text class="font-28 color-d"><text class="color-e m-r-5">*</text>姓名</text>
				<input v-model="form.name" class="text-right flex-1 m-l-20 font-28 color-a" placeholder="未填写"
					type="text">
			</view>
			<view class="h-120 flex-between back-color-c p-l-30 p-r-30">
				<text class="font-28 color-d"><text class="color-e m-r-5">*</text>身份证号</text>
				<input v-model="form.card_id" class="text-right flex-1 m-l-20 font-28 color-a" placeholder="未填写"
					type="idcard">
			</view>
			<view class="h-120 flex-between back-color-c p-l-30 p-r-30">
				<text class="font-28 color-d"><text class="color-e m-r-5">*</text>手机号</text>
				<input v-model="form.mobile" class="text-right flex-1 m-l-20 font-28 color-a" placeholder="未填写"
					maxlength="11" type="number">
			</view>
		</view>

		<bottom-button @click='addContract'>下一步</bottom-button>
	</view>
</template>

<script>
	export default {
		name: "createContract",
		data() {
			return {
				item: {},
				type: 1,
				form: {
					type: '',
					name: '',
					card_id: '',
					mobile: ''
				}
			}
		},
		computed: {
			select_assets() {
				return this.$store.state.select_assets
			},
		},
		onLoad(ops) {
			if (ops.type) {
				this.type = ops.type
				this.form.type = this.type == 1 ? '运营合同' : '装修合同'
			}
		},
		methods: {
			// 添加合同
			async addContract() {
				if (!this.select_assets.assets_id) {
					uni.showToast({
						icon: 'none',
						title: '请选择资产',
					})
					return
				}

				if (Object.values(this.form).indexOf("") !== -1) {
					uni.showToast({
						icon: 'none',
						title: '信息不能为空',
					})
					return
				}

				if (!uni.$u.test.mobile(this.form.mobile)) {
					uni.showToast({
						icon: 'none',
						title: '手机号错误',
					})
					return
				}

				if (!uni.$u.test.idCard(this.form.card_id)) {
					uni.showToast({
						icon: 'none',
						title: '身份证号错误',
					})
					return
				}

				let params = {
					assets_id: this.select_assets.assets_id,
					lessee_name: this.form.name,
					lessee_mobile: this.form.mobile,
					lessee_id_card: this.form.card_id,
					type: this.type
				}

				uni.showLoading({
					title: '加载中'
				});
				const res = await this.$api.common.landlord('addContract', params)
				if (res.code === 200) {
					uni.hideToast();
					// #ifdef H5
					window.location.href = res.data
					// #endif
					// #ifdef APP-PLUS
					this.jump(`/pages/webview/index?src=${encodeURI(res.data)}`)
					// #endif
				}
			},
		},
	}
</script>

<style lang="scss" scoped>
	.btns {
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
		padding: 22rpx 30rpx 98rpx;
		box-sizing: border-box;
		background: #FFFFFF;
		box-shadow: 0rpx -4rpx 16rpx 0rpx rgba(0, 0, 0, 0.1000);

		.btn {
			height: 88rpx;
			background: #FB2D19;
			font-size: 32rpx;
			font-weight: 500;
			color: #FFFFFF;
			line-height: 88rpx;
			border-radius: 49rpx;
			text-align: center;
		}
	}
</style>
